<%@ page language="java" contentType="text/html" pageEncoding="utf-8"%>
<%@ include file="/WEB-INF/jsp/common/taglibs.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no,minimum-scale=1,maximum-scale=1.0" />
<meta name="format-detection" content="telephone=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<title>会员信息 - 红高粱</title>
<link type="text/css" rel="stylesheet" href="../m/css/change.css"/>
<script type="text/javascript" src="../m/js/jquery.min.js"></script>
<script type="text/javascript" src="../m/js/huaping.js"></script>
<script type="text/javascript" src="../m/js/jquery.tmpl.min.js"></script>
<script type="text/javascript" src="../m/js/cart.js"></script>
<script type="text/javascript" src="../m/js/jquery.msg.src.js"></script>
<script type="text/javascript" src="../m/js/user.js"></script>
<style type="text/css">
header{width:100%;background-image:url("");overflow:hidden;background-size:cover; }
header .avatar{width:45%;margin:0 auto; margin-top:20px; }
header .avatar img{ width:100%}
header .c_pass{float:left;width:35%; margin:5% 3.946% 5.5% 11.23%;}
header .c_pass img{ width:100%}
header .exit{float:left;width:35%;margin:5% 10.23% 5.5% 3.946%; }
header .exit img{ width:100%}
body{ background-image:url("../m/images/c_shop_bg3.jpg");}/*c_shop_bg3.png为超长背景*/
*{ margin:0; padding:0;}
.menu_list a{text-shadow:#5f472d 0px 0px 2px; color:#fff; font-weight:bold; text-decoration: none;}
.menu_list{height:50px;float:left;width:100%;text-align:left;line-height:50px;background:url("../m/images/user_info_unchoose.png");overflow:hidden;margin-bottom:0px;}
.nav_list {float:left;}
.nav_list img{ height:50px;}
.my_order,.my_zl,.my_card{float:left; width:49.3333%; text-align:center; overflow:hidden;}
.my_zl a{color:#bfbfbf;}
.clear_both{clear:both;}
.list{width:96%;text-align:center;margin:0 auto;overflow:hidden;box-shadow: 0px 0px 2px #26282b;background:url("../m/images/user_textfield_bg.png");border:0px solid #272a2d; color:#686868; margin-bottom:5px;}
.menu_content{line-height:38px;}
.border{background:url("../m/images/u_info_list2.png") repeat-x;background-position:bottom;width:97%;}
.order_t{background:url("../m/images/u_info_list2.png") repeat-x;background-position:top; height:auto;float: left; width:97%;}
.order_d{background:url("../m/images/u_info_list2.png") repeat-x;background-position:top; height:auto;float: left; width:97%; padding:10px 0;}
.order_d img{ width:35%; float:left;text-align:left; padding-left:10px;}
.product_div{height:auto;float:left; width:100%;text-align:center;}
.product_div img{float:left;margin:5px 0 5px 5px; }
.order{float: left; width:100%; overflow:hidden;}
.border{float: left; width:100%; overflow:hidden;}
.txt{width:90px;text-align:right; float:left;color:#fff;}
.txt2{width:86%;text-align:left;color:#fff;}
.href_style{text-decoration:none;}
</style>
<!-- 
header{width:100%;background-image:url("../m/images/u_head.png");overflow:hidden;background-size:cover; }
<div class="avatar"><a href="#"><img src="../m/images/logo.png"></a></div>


.border{background:url("../m/images/u_info_list.png") repeat-x;background-position:bottom;}
.order_t{background:url("../m/images/u_info_list.png") repeat-x;background-position:top; height:auto;float: left; width:100%;}
.order_d{background:url("../m/images/u_info_list.png") repeat-x;background-position:top; height:auto;float: left; width:100%; padding:10px 0;}

 -->
</head>
<header style="margin-top:13%;">
	<div class="header">
		<div class="avatar"><a href="#"><img src="../m/images/logo.png"></a></div>
		<div class="c_pass"><a href="#"><img id="updatePass" src="../m/images/c_pass.png"></a></div>		
		<div class="exit"><a href="#"><img id="userExit" src="../m/images/exit.png"></a></div>
	</div>
</header>
<body>
	<div style="text-align:center;">
		<div class="menu_list">
			<div class="my_order" style="height:105%;background:url(m/images/c_shop_bg.png) repeat-x;">
				<a href="javascript:location.reload(true);" class="href_style">我的订单</a>
			</div>
			<div class="nav_list">
				<img src="../m/images/user_list2.png">
			</div>
			<div class="my_zl">
				<a href="javascript:" onclick="location.href='./userInfos?cid=${loginId}'" class="href_style">我的资料</a>
			</div>					
		</div>
		<div class="menu_content">

			<c:forEach var="o" items="${orders}" varStatus="var">
				<div class="list">
					<div class="order">
					<c:if test="${0==var.index}">
						<div class="arrow" style="width:100%; position:absolute;right:26%;line-height:0px;">
							<img src="../m/images/user_info_choose.png">
						</div>
					</c:if>
					<c:if test="${0==var.index}">
						<div class="border" style="margin-top:5px;">
							<div class="txt">订单号：</div>						
							<div class="txt2">${o.orderId}</div>
						</div>
					</c:if>	
					<c:if test="${0!=var.index}">
						<div class="border">
							<div class="txt">订单号：</div>						
							<div class="txt2">${o.orderId}</div>
						</div>
					</c:if>	
						<div class="border">
							<div class="txt">订单金额：</div>
							<div class="txt2">￥ ${o.totalPrice}</div>
						</div>
						<div class="border">
							<div class="txt">下单时间：</div>
							<div class="txt2">
								<fmt:formatDate value="${o.date}" pattern="yyyy-MM-dd HH:mm:ss" />
							</div>
						</div>
					</div>
					<div class="border2" >
						<div class="txt">产品列表：</div>
						<div class="product_div" id="product_div${o.id}"></div>
						<script type="text/javascript">
							$(document).ready(function(){
								var json = ${o.products};
								var id = ${o.id};
								for(var i=0; i<json.length; i++)  
								{  
									var prePath = window.document.location.href; 
								    //获取主机地址之后的目录，如： "/timefurniture/cart"
								    var pathName = window.document.location.pathname; 
								    //获取主机地址
								    var pos = prePath.indexOf(pathName); //21
								    //获取带"/"的项目名，如："http://localhost:8080"
								    var localhostPath = prePath.substring(0, pos);
								 	//完整项目路径，如："http://localhost:8080/timefurniture"
								    var rootPath = localhostPath + projectName; 
								    
									var img = "<a href='"+rootPath+"/detail/"+json[i].id+'.html'+"'>"+
											"<img style='height:80px;width:auto;' src='"+localhostPath+json[i].images+"'></a>";
									
									$("#product_div"+id).append(img);
								}
							});
						</script>
					</div>
					<br>
					<div class="order_t" >
						   <div class="txt">订单状态：</div>
						   <div class="txt2" style="">
						   		<!-- 如果是配送中和已送达状态，则显示即可 -->
						   	   <c:if test="${o.sendStatus eq 2}"><span style="color:green;">配送中</span></c:if>
						   	   <c:if test="${o.sendStatus eq 3}"><span style="color:green;">已送达</span></c:if>
						   	   <c:if test="${o.sendStatus eq 1 && o.payStatus eq 0}"><span style="color:red;">未支付</span></c:if>
						   	   <c:if test="${o.sendStatus eq 1 && o.payStatus eq 1}"><span style="color:green;">已支付：未配送</span></c:if>
						   </div>
					</div>
					<div class="order_d" >
						   <a href="javascript:deleteOrder('<c:url value="/orderm/delete/${o.id }?cid=${loginId }"/>')"><img src="../m/images/order_delete2.png"></a>
					</div>
					<c:if test="${o.sendStatus == 111}"><!-- 写错了 暂留 -->
						<div class="order_d">
							<a href="javascript:repayOrder(${o.orderId}, ${o.totalPrice})"><img src="../m/images/order_delete.png"></a>
						</div>
					</c:if>
				</div>
			</c:forEach>
		</div>
		<div class="clear_both"></div>
	    <div style="margin-top:10px;">
	    	<c:if test="${enablePage }">
	    		<c:if test="${enableFirst }">
	    			<a href="<c:url value="/user/backend?page=${prev }&cid=${loginId }"/>"><img src="../m/images/user_pre.png" width="30%"></a>
	    		</c:if>
	    		<c:if test="${enableLast }">
	    			<a href="<c:url value="/user/backend?page=${next }&cid=${loginId }"/>"><img src="../m/images/user_next.png" width="30%"></a>
	    		</c:if>
	    	</c:if>
	    </div>
    </div>
<script type="text/javascript">
//删除订单
function deleteOrder(url){
	if(confirm("是否删除?")){
		location.href=url;
	}
}
</script>
<script style="text/javascript">
	function repayOrder(orderId, price){
		location.href="../pay/repay?price=" + price + "&orderId=" + orderId;
		return;
	}
</script>

</body>
 <div class="clear_both"></div>
<%@ include file="footer.jsp" %>
</html>
